import Vue from 'vue'
import Vuex from 'vuex'
// import axios from 'axios'
import movies from './modules/movies'
import { getList } from '../services/products'

Vue.use(Vuex)

const store = new Vuex.Store({
  state: {
    count: 1,
    list: [],
    pages: 1,
    totals: 1,
    page: 1,
    cartCount: 0
  },
  mutations: {
    plus(state, step = 1) {
      state.count += step
    },
    reduce(state) {
      state.count--
    },
    loadDataEnd(state, payload) {
      this.state.list = [...state.list, ...payload.products]
      state.pages = payload.pages
      state.totals = payload.totalsCount
      state.page++
    },
    buy(state) {
      this.state.cartCount++
    }
  },
  actions: {
    /* loadData({ commit }, { page }) {
      axios
        .get('http://localhost:3009/api/v1/products', {
          params: { page }
        })
        .then(res => {
          console.log(res.data)
          commit('loadDataEnd', res.data)
        })
    } */
    async loadData({ commit }, { page }) {
      const res = await getList(page)
      commit('loadDataEnd', res)
    }
  },
  getters: {
    listCount(state) {
      return state.list.length
    }
  },
  modules: {
    movies
  }
})

export default store
